<template>
  <div class="coupon_verification">
    <div class="center">
      <div class="qr">
        <div class="div2">
          <img style="width:3rem" src="~/static/coupon/validate_success.png" />
          <p>核销成功</p>
          <div style=" margin: 2rem auto ">
            <p style="font-size:0.3rem">
              核销时间：
              {{ writeOffTime }}
            </p>
          </div>
          <van-button
            type="primary"
            size="normal"
            style="width:100%;height:1rem"
            @click="goback"
            >返回</van-button
          >
        </div>
      </div>
    </div>
    <div class="bottom">
      <div>更多活动，请关注我们的公众号</div>
      <div>上海深斯能源科技有限公司提供技术支持</div>
    </div>
  </div>
</template>

<script>
import Vue from "vue";
import { mapGetters } from "vuex";
import { Button } from "vant";

Vue.use(Button);
export default {
  head() {
    return {
      title: "核销"
    };
  },
  data() {
    return {
      writeOffTime: ""
    };
  },

  computed: {
    ...mapGetters({
      userInfo: "authen/userInfo"
    })
  },
  created() {
    console.log(this);
    this.writeOffTime = this.$route.query.writeOffTime;
  },

  methods: {
    downloadImg() {
      console.log("~~~~");
    },
    goback() {
      this.$router.replace(`/${this.enterpriseId}/point`);
    }
  }
};
</script>

<style lang="scss" scoped>
.coupon_verification {
  width: 80vw;
  min-height: 100vh;
  margin: auto;
  background: #ffffff;
  padding: 0 0.3rem 0 0.3rem;
  box-sizing: border-box;

  > .top {
    width: 6.9rem;
    height: 1rem;

    .fixed {
      position: fixed;
      top: 0;
      left: 0;
      width: 7.5rem;
      height: 1rem;
      padding: 0 0.3rem 0 0.3rem;
      box-sizing: border-box;
      background: #ffffff;
      display: flex;
      justify-content: space-around;
      align-items: center;
      span {
        height: 0.45rem;
        font-size: 0.32rem;
        font-weight: 400;
        color: #aaaaaa;
        line-height: 0.45rem;
        letter-spacing: 0.01rem;
      }
      span.selected {
        color: #111111;
      }
    }
  }
  > .center {
    .qr {
      margin-top: 4vh;
      img {
        max-width: 100%;
      }
      .text {
        text-align: justify;
        margin-top: 1rem;
      }

      .div1 {
        img {
          box-shadow: 0px 1px 4px 0px #ddd;
        }
      }
      .div2 {
        text-align: center;
        i {
          font-size: 2rem;
          color: green;
        }
        p {
          font-size: 0.5rem;
        }
      }
    }
  }
  > .bottom {
    margin-top: 0.8rem;
    margin-bottom: 0.3rem;
    text-align: center;
    font-size: 0.22rem;
    font-family: PingFangSC-Regular, PingFang SC;
    font-weight: 400;
    color: rgba(0, 0, 0, 0.25);
    line-height: 0.32rem;
    letter-spacing: 1px;
  }
}
</style>
